﻿<div id="myCarousel" class="myCarousel carousel slide ">
    <ol class="carousel-indicators">
        <li data-target="#myCarousel" data-slide-to="0" class="active"></li>
        <li data-target="#myCarousel" data-slide-to="1"></li>
        <li data-target="#myCarousel" data-slide-to="2"></li>
    </ol>
    <div class="carousel-inner">
        <div class="item">
            <a href="http://bbs.h3bpm.com" target="_blank">
                <img src="img/demo/banner10.jpg" />
            </a>
        </div>
        <div class="item active">
            <a href="http://bbs.h3bpm.com" target="_blank">
                <img src="img/demo/banner20.jpg" />
            </a>
        </div>
        <div class="item">
            <a href="http://bbs.h3bpm.com" target="_blank">
                <img src="img/demo/banner30.jpg" />
            </a>
        </div>
    </div>
    <!-- data-slide="prev"    data-slide="next"  href="#myCarousel" href="#myCarousel"-->
    <a class="carousel-control left prev-slide " style="position:absolute;">&lsaquo;</a>
    <a class="carousel-control right next-slide"  style="position:absolute;">&rsaquo;</a>
</div>
<!-- lazy -->
<script type="text/javascript">
    $(function () {
        $('.carousel').carousel({
            interval: 3000
        })
        $('.prev-slide').click(function () {
            $('#myCarousel').carousel('prev');
        });
        $('.next-slide').click(function () {
            $('#myCarousel').carousel('next');
        });
    });
</script>
